<template>
    <div id="chart-order" ref="chart-storage"></div>
</template>

<script>
import $ from 'jquery'
import 'jquery-sparkline'

export default {
  name: 'order-chart',
  data () {
    return {
      orderData: [345, 404, 305, 455, 378, 567, 586, 685, 458, 742, 565]
    }
  },
  mounted () {
    let options = {
      type: 'line',
      width: '100%',
      height: '40',
      spotRadius: 4,
      lineWidth: 1,
      lineColor: '#ffffff',
      fillColor: false,
      minSpotColor: false,
      maxSpotColor: false,
      highlightLineColor: '#ffffff',
      highlightSpotColor: '#ffffff',
      tooltipChartTitle: 'Earning',
      tooltipPrefix: '$ ',
      spotColor: '#ffffff',
      valueSpots: {
        '0:': '#ffffff'
      }
    }

    $('#chart-order').sparkline(this.orderData, options)
  }
}
</script>

<style scoped>

</style>
